define(["utils", "base"], function (utils, baseClass) {
    var Component = function (config) {
        var _this = this;
        Component.baseConstructor.call(this, config);
        this.config.style = this.config.style || {};
        this.$el.addClass(" yy-input ");
        var input_mode =this.config.mode==="number"?"text":(this.config.mode || "text") ; // 专供input type使用
        var mode = this.config.mode || "text";
        var name = this.config.name || 'file';
        var placeholder = this.config.placeholder || "";
        var isInForm = config.isInForm;
        var maxLength = this.config.maxlength;
        this.input = $("<input type='" + input_mode + "' />");
        if (placeholder) {
            this.input.attr("placeholder", placeholder);
        }
        if (maxLength) {
            // this.input.attr("maxlength", maxLength);
            // this.$el.bind("keyup", function (e) {
            //     var value = _this.getValue();
            //     if(value.length>=maxLength){
            //         _this.setValue(value.substring(0,maxLength));
            //     }
            // });
            this.$el.on('keyup', function() {

                if($(this).prop('comStart')) return;    // 中文输入过程中不截断
                var value = _this.getValue();
                if(value.length>maxLength){
                    _this.setValue(value.substring(0,maxLength));
                }
            }).on('compositionstart', function(){
                $(this).prop('comStart', true);
            }).on('compositionend', function(){
                $(this).prop('comStart', false);
            });
        }
        if (mode === "file") {
            // this.input.attr("multiple", "false");
            this.input.attr("name", name);
        }
        var inputStyle = {
            fontSize: this.config.style.fontSize || "13px",
            color: this.config.style.color || "black"
        };
        utils.css(this.input, inputStyle);

        this.$el.append(this.input);


        var method_name = config.comKey + "_keydown";
        var method_keydown = _this.pageview.plugin[method_name];

        if (mode === "number") {
            this.$el.on('input', function (e) {
                var curValu = _this.input.val();

                if (e.keyCode === 190) {
                    if (curValu.indexOf(".") >= 0) {
                        e.stopPropagation();
                        e.preventDefault();
                        e.returnValue = false;
                        return;
                    }
                }

                curValu = curValu.replace(/[^0-9\.]/g, '');

                if (curValu.indexOf('.') > -1) {
                    _this.setValue(curValu);
                } else {
                    _this.setValue(parseInt(curValu));
                }
            });
            this.$el.bind("keydown", function (e) {
                var curValu = _this.input.val();
                if (e.keyCode === 190) {
                    if (curValu.indexOf(".") >= 0) {
                        e.stopPropagation();
                        e.preventDefault();
                        e.returnValue = false;
                        return;
                    }
                }

                !_this.disabled && method_keydown && method_keydown.call(_this.pageview.plugin, _this, {e: e});
            });
            this.input.on('compositionstart', function (e) {
                var curValu = _this.input.val();
                curValu = curValu.replace(/[^0-9\.]/g, '');
                _this.setValue(curValu);
            });
            this.input.on('compositionend', function (e) {
                var curValu = _this.input.val();
                curValu = curValu.replace(/[^0-9\.]/g, '');
                _this.setValue(curValu);
            });
        }
        if (method_keydown && mode !== "number") {
            this.$el.bind("keydown", function (e) {
                !this.disabled && method_keydown && method_keydown.call(_this.pageview.plugin, _this, {
                    e: e
                });
            });
        }
        var method_change_name = config.comKey + "_change";
        var method_change = _this.pageview.plugin[method_change_name];
        if (method_change) {
            this.$el.bind("change", function (e) {
                !this.disabled && method_change && method_change.call(_this.pageview.plugin, _this, {
                    e: e
                });
            });
        }

        var keyUpName = config.comKey + "_keyup";
        var keyUpMethod = _this.pageview.plugin[keyUpName];
        if (keyUpMethod) {
            this.$el.bind("keyup", function (e) {
                !this.disabled && keyUpMethod && keyUpMethod.call(_this.pageview.plugin, _this, {
                    e: e
                });
            });
        }

        var keyPressName = config.comKey + "_keypress";
        var keyPressMethod = _this.pageview.plugin[keyPressName];
        if (keyPressMethod) {
            this.$el.bind("keypress", function (e) {
                !this.disabled && keyPressMethod && keyPressMethod.call(_this.pageview.plugin, _this, {
                    e: e
                });
            });
        }

        var focus_name = config.comKey + "_focus";
        var focus_nameMethod = _this.pageview.plugin[focus_name];
        if (focus_nameMethod) {
            this.input.bind("focus", function (e) {
                !this.disabled && focus_nameMethod && focus_nameMethod.call(_this.pageview.plugin, _this, {
                    e: e
                });
            });
        }

        var blur_name = config.comKey + "_blur";
        var blur_nameMethod = _this.pageview.plugin[blur_name];
        if (blur_nameMethod) {
            this.input.bind("blur", function (e) {
                !this.disabled && blur_nameMethod && blur_nameMethod.call(_this.pageview.plugin, _this, {
                    e: e
                });
            });
        }

        this.value = this.config.value === 0 ? 0 : (this.config.value || "");
        this.setValue(this.value);
    }

    utils.extendClass(Component, baseClass);

    Component.prototype.getValue = function () {
        // return $.trim(utils.deleteEmoji(this.input.val()));
        return $.trim(utils.deleteEmoji($('<span/>').text(this.input.val()).html()));
    };
    Component.prototype.getText = function () {
        return $('<span/>').text(this.input.val()).html();
    };
    Component.prototype.setValue = function (val) {
        // this.input.val(val);
        this.value = val;
        if (this.config.mode === 'number') {
            this.input.val($('<span/>').html(val).text());
        } else {
            this.input.val($('<span/>').html(val).text());
        }
    };
    Component.prototype.setDisabled = function (disabled, isNoStyle) {
        this.disabled = disabled;
        if (this.disabled) {
            this.input.attr("disabled", "disabled");
            if (isNoStyle === true) {} else {
                this.$el.addClass(this.disabledClassName);
            }

        } else {
            this.input.removeAttr("disabled");
            this.$el.remove(this.disabledClassName);
        }
    };
    Component.prototype.focus = function (val) {
        var _this = this;
        _this.input.focus();
    };

    Component.prototype.blur = function () {
        var _this = this;
        _this.input.blur();
    };
    return Component;
});
